import { createAppleSplashScreens, defineConfig, Preset } from '@vite-pwa/assets-generator/config'


const minimal2023Preset: Preset = {
  transparent: {
    sizes: [64, 192, 512],
    padding: 0
  },
  maskable: {
    sizes: [512],
    padding: 0
  },
  apple: {
    sizes: [180],
    padding: 0
  },
  assetName(type, size) {
    switch (type) {
      case 'transparent':
        return `pwa-icon-${size.width}x${size.height}.png`
      case 'maskable':
        return `maskable-icon-${size.width}x${size.height}.png`
      case 'apple':
        return `apple-touch-icon-${size.width}x${size.height}.png`
    }
  },
  appleSplashScreens: createAppleSplashScreens({
      padding: 0.3,
      resizeOptions: { background: 'black', fit: 'contain' },
      // by default, dark splash screens are exluded
      // darkResizeOptions: { background: 'black' },
      linkMediaOptions: {
        // will log the links you need to add to your html pages
        log: true,
        // add screen to media attribute link?
        // by default:
        // <link rel="apple-touch-startup-image" href="..." media="screen and ...">
        addMediaScreen: true,
        basePath: '/',
        // add closing link tag?
        // by default:
        // <link rel="apple-touch-startup-image" href="..." media="...">
        // with xhtml enabled:
        // <link rel="apple-touch-startup-image" href="..." media="..." />
        xhtml: false
      },
      png: {
        compressionLevel: 9,
        quality: 60
      },
      name: (landscape, size, dark) => {
        return `apple-splash-${landscape ? 'landscape' : 'portrait'}-${(dark ? 'dark-' : '')}${size.width}x${size.height}.png`
      }
    },
    ['iPad 9.7"', 'iPhone 14', 'iPhone 13', 'iPhone 8', 'iPhone SE 4"']
  )
}

export default defineConfig({
  headLinkOptions: { preset: '2023' },
  preset: minimal2023Preset,
  images: ['public/icons/app-icon.svg']
})